import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import { Form, Button, Card } from 'antd';
import Img from 'react-image';
import moment from 'moment';
import DescriptionList from '../../components/DescriptionList';
import PageHeaderLayout from '../../layouts/PageHeaderLayout';
import globalConstant from '../../utils/globalConstant';
import { urlParams } from '../../utils/utils';

const { Description } = DescriptionList;

@connect(({ packageOrder, loading }) => ({
  packageOrder,
  loading: loading.models.packageOrder,
}))
@Form.create()
export default class SpeedUpOrderPass extends PureComponent {
  state = {
  }
  componentDidMount() {
    const { dispatch } = this.props;
    dispatch({
      type: 'packageOrder/getPackageOrderDetail',
      payload: {
        id: urlParams('id', window.location.href),
      },
    });
  }
  ContinueReview =() => {
    this.props.dispatch(routerRedux.push('/account/speeduporder'));
  }
  render() {
    const { loading } = this.props;
    const { packageOrderInfo } = this.props.packageOrder;
    return (
      <PageHeaderLayout title="用戶管理">
        <Card title="提速订单通过审核" loading={loading} >
          <DescriptionList size="large" title="" style={{ textAlign: 'center', justifyContent: 'center' }} col={1}>
            <Img style={{ width: 170, height: 90, marginBottom: 42 }} src="./img/icon-3.png" />
            <div style={{ marginBottom: 32 }}>审核通过并提速成功</div>
            <div style={{ marginBottom: 42 }}>提速信息已经发送给用户。</div>
          </DescriptionList>
          <Card title="" extra={`创建时间：   ${moment(packageOrderInfo.createTime).format(globalConstant.time)}`} >
            <DescriptionList size="large" col={2}>
              <Description term="姓    名">{packageOrderInfo.userContactName}</Description>
              <Description term="电      话">{packageOrderInfo.userContactPhone}</Description>
              <Description term="地    址">{packageOrderInfo.installAddress}</Description>
              <Description term="套餐名称">{packageOrderInfo.packagesName}</Description>
              <Description term="原 网 速">{packageOrderInfo.oldPackagesSpeed}</Description>
              <Description term="提速后网速">{packageOrderInfo.packagesSpeed}</Description>
              <Description term="金     额">{packageOrderInfo.packagesPrice}元</Description>
            </DescriptionList>
            <Description term="">
              <Button style={{ width: 130, marginTop: 70 }} type="primary" onClick={this.ContinueReview}>
                继续审核订单
              </Button>
            </Description>
          </Card>
        </Card>
      </PageHeaderLayout>
    );
  }
}
